import React from "react";
import {
  View,
  TouchableOpacity,
  Text,
  TextInput,
  ScrollView
} from "react-native";

import SizeUtils from "../../common/SizeUtils";
import CommonStyles from "../../common/CommonStyles";
import ToastUtils from "../../common/ToastUtils";
import Config from "../../config";
import Constants from "../../common/Constants";
import BasePage from "../common/BasePage";
import UserUpdateSelfDataAction from "../../actions/user/UserUpdateSelfDataAction";
import ResponseConstants from "../../common/ResponseConstants";
export default class UserEmailPage extends BasePage {
  constructor(props) {
    super(props);
    this.state.data = Constants.USER;
    this.state.nick = Constants.USER.nick;
    this.state.email = Constants.USER.email;

    this.state.statusText = "";
  }

  _dealComponentWillUpdate(nextProps, nextState) {
    if (nextState.statusText != "") {
      ToastUtils.show(nextState.statusText);
      nextState.statusText = "";
    }
    if (nextState.updateResult === true) {
      nextState.updateResult = false;
      this.goBack();
    }
  }

  render() {
    return (
      <View
        style={[
          CommonStyles.page,
          {
            paddingTop: Config.paddingTop,
            paddingLeft: SizeUtils.translateDesignWidthToCode(40),
            paddingRight: SizeUtils.translateDesignWidthToCode(40),
            backgroundColor: "#ffffff"
          }
        ]}
      >
        <ScrollView
          style={{
            height: SizeUtils.getWindowSize().height - Config.paddingTop
          }}
          alwaysBounceHorizontal={false}
          alwaysBounceVertical={false}
          keyboardShouldPersistTaps="never"
        >
          {this._renderNickName()}
        </ScrollView>
        {this._renderNavigationBar()}
      </View>
    );
  }

  _renderNickName() {
    return (
      <View
        style={{
          paddingTop: SizeUtils.translateDesignHeightToCode(100),
          borderBottomWidth: SizeUtils.translateDesignNumToCode(3),
          borderColor: "#eeeeee"
        }}
      >
        <TextInput
          style={{
            padding: 0,
            width: this._width,
            height: SizeUtils.translateDesignHeightToCode(94),
            borderWidth: 0,
            textAlignVertical: "center",
            fontSize: SizeUtils.translateFontSizeToCode(34)
          }}
          underlineColorAndroid="transparent"
          onChangeText={email => this.setState({ email })}
          placeholder="请输入邮箱"
          multiline={false}
          maxLength={50}
          clearButtonMode={"while-editing"}
          value={this.state.email || ""}
        />
      </View>
    );
  }

  // 保存
  _onPressNavigationBarRightBtn() {
    if (this.state.email == Constants.USER.email) {
      ToastUtils.show("昵称没有变化!");
      return;
    }
    if (this.state.email != "" && this.strlen(this.state.email) >= 4) {
      new UserUpdateSelfDataAction().call(this, {
        email: this.state.email
      });
    } else {
      ToastUtils.show("输入的邮箱不正确");
    }
  }

  strlen(str) {
    var len = 0;
    for (var i = 0; i < str.length; i++) {
      var c = str.charCodeAt(i);
      //单字节加1
      if ((c >= 0x0001 && c <= 0x007e) || (0xff60 <= c && c <= 0xff9f)) {
        len++;
      } else {
        len += 2;
      }
    }
    return len;
  }
}
